<template>
	<view class="addAddress">
		<form @submit="">
			<view class="addEach">
				<view class="title">收货人</view>
				<input v-model="addForm.name" class="uni-input" name="input" placeholder="请填写收货人姓名" />
			</view>
			<view class="addEach">
				<view class="title">手机号码</view>
				<input v-model="addForm.phone" class="uni-input" type="number" name="input" placeholder="请填写收货人手机号" />
			</view>
			<view class="addEach">
				<view class="title">选择地区</view>
				<input v-model="area" class="uni-input" name="input" placeholder="省市区县、乡镇等" @tap="areaSelect" :disabled="true" />
				<u-icon name="map" color="#666666" label-pos="left" size="38" label="定位" @tap="getLoc"></u-icon>
			</view>
			<view class="addEach" style="height: 150rpx;">
				<view class="title" style="width: 180rpx;">详细地址</view>
				<textarea v-model="addForm.detail" placeholder-style="color:#999999" style="height: 100rpx;margin-top: 25rpx;line-height: 44rpx;" placeholder="街道、楼牌号等"/>
			</view>
			<!-- <view class="addEach mt16">
				<view class="title" style="width: 330rpx;">设为默认地址</view>
				<view style="text-align: right;width: 100%;">
					<switch :v-model="false" @change="setDefaultAddress" name="switch" color="#FF5238" style="transform:scale(0.7)" />
				</view>
			</view> -->
		</form>
		<!-- 新建按钮 -->
		<view class="addBtnBox" :style="{paddingBottom:isIphoneX?'76rpx':''}">
			<view class="addAddressBtn" @tap="saveAddress">保存</view>
		</view>
		<!-- 区域选择器 -->
		<u-picker v-model="areaShow" mode="region" @confirm="addressConfirm"></u-picker>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				// 手机机型
				modelmes:null,
				isIphoneX:false,
				goodsId:null,
				orderId:null,
				tlId:null,
				cId:null,
				addForm: {
					name: '',
					phone: '',
					detail:'',
					is_def:1,
					area_id:'',
					code:''
				},
				area: '',
				areaShow:false,//区域选择
			};
		},
		onLoad: function (option) { //option为object类型，会序列化上个页面传递的参数
			// 判断机型iPhone X的
			this.modelmes = uni.getStorageSync('modelmes');
			if (this.modelmes.search('iPhone X') != -1) {
			   this.isIphoneX = true;
			}
			if(option.id){
				this.goodsId = option.id;
			}
			if(option.oId){
				this.orderId = option.oId;
			}
			if(option.tlId){
				this.tlId = option.tlId;
				this.cId = option.cId;
			}
		},
		methods:{
			areaSelect(){
				this.areaShow = true
			},
			addressConfirm(e){
				this.area = e.province.label +' '+ e.city.label +' '+ e.area.label;
				this.addForm.code = e.area.value;
			},
			getLoc(){
				var _this = this;
				uni.chooseLocation({
				    success: function (res) {
						uni.request({
							method:'GET',
							url:'https://apis.map.qq.com/ws/geocoder/v1/?location='+res.latitude+','+res.longitude+'&key=UNRBZ-AVCK4-QQYUP-DN6OL-2OAJO-3NFUA&get_poi=1',
						    dataType:'json',
						    success: (res) => {
								var resData = res.data.result.ad_info;
								var resDataAdd = res.data.result.formatted_addresses;
								_this.area = resData.province + ' ' + resData.city + ' ' + resData.district;
								_this.addForm.detail = resDataAdd.recommend;
								_this.addForm.code = resData.adcode;
						    }
						});
				    }
				});
			},
			// 设置默认地址
			setDefaultAddress(e){
				if(e.target.value==true){
					this.addForm.is_def = 1;
				}else{
					this.addForm.is_def = 2;
				}
			},
			// 保存地址
			saveAddress(){
				var _this = this;
				if(this.addForm.name == '' || this.addForm.phone == '' || this.addForm.area == ''){
					uni.showToast({
						icon: 'none',
						duration:1000,
						title: '请将信息填写完整'
					});
					return false;
				}
				var regPhone = /^1[0-9]{10,10}$/;
				if (!regPhone.test(this.addForm.phone)){
					uni.showToast({
						icon: 'none',
						duration:1000,
						title: '请输入格式正确的手机号'
					});
					return false;
				}
				
				this.apipost('/fun/ship-address/create',this.addForm).then(res =>{
					if(res.data.status == 200 ) {
						var resData = res.data.data;
						if(_this.goodsId){//确认订单修改地址
							uni.navigateBack({
							    delta: 1
							});
						}
						if(_this.orderId){//未支付订单修改地址
							this.apipost('/fun/order/deal-address',{id:_this.orderId,ship_id:resData.id}).then(res =>{
								if(res.data.status == 200 ) {
									uni.navigateBack({
									    delta: 1
									});
								}
							})
						}
						if(_this.tlId){//酒卡转线上 
							uni.setStorage({
								key: 'sId',
								data: resData.id,
								success: function () {
									uni.navigateBack({
										delta: 1
									});
								}
							});
							// uni.redirectTo({
							// 	url: '../scanCode/turnLine?orderId='+_this.tlId+'&cardId='+_this.cId+'&sId='+resData.id
							// });
						}
					}
				})
			}
		}
	};
</script>

<style lang="scss">
	.u-swipe-del{
		display: flex;
		
	}
	
	
	.addAddress{
		min-height: 100%;
		padding-bottom: 110rpx;
		background-color: #F8F8FA;
		
		.mt16{
			margin-top: 16rpx;
		}
		.mr20{
			margin-right: 20rpx;
		}
		
		.addEach{
			display: flex;
			padding: 0 32rpx;
			height: 100rpx;
			line-height: 100rpx;
			background-color: #fff;
			box-shadow: inset 0px -0.5px 0px #ECEEF0;
			
			.title{
				width: 160rpx;
			}
			.uni-input{
				flex: auto;
				height: 100%;
			}
			
		}
	}
	.addBtnBox{
		position: fixed;
		bottom: 0;
		left: 0;
		width: 100%;
		padding: 8rpx 32rpx;
		line-height: 80rpx;
		background-color: #fff;
		
		.addAddressBtn{
			height: 80rpx;
			background: #FF5238;
			border-radius: 44rpx;
			font-size: 32rpx;
			color: #fff;
			text-align: center;
		}
	}
</style>
